<template>
  <div class="adminqianming">
    <admin_top></admin_top>
    <div style="padding:0 20px 20px 20px" class="t_btn_box">
        <el-input style="width:180px" size="small" v-model="all.shop_name" placeholder="请输入店铺名称"></el-input>
        <el-button @click="search" size="small" type="danger">搜索</el-button>
    </div>
    <div style="padding: 0 20px;">
      <el-table :data="tableData" style="text-align: center;" align="center" border :loading="loading">
        <el-table-column label="店铺名">
          <template slot-scope="scope">
            <span>{{ scope.row.shop_name }}</span>
          </template>
        </el-table-column>
        <el-table-column label="姓名">
          <template slot-scope="scope">
            <span>{{ scope.row.id_card_name }}</span>
          </template>
        </el-table-column>
        <el-table-column label="身份证号">
          <template slot-scope="scope">
            <span>{{ scope.row.id_card_num }}</span>
          </template>
        </el-table-column>
        <el-table-column label="营业资格证">
          <template slot-scope="scope">
            <div v-if="scope.row.credentials">
              <el-image @click="openimg(scope.row.credentials)" style="width: 200px" :src="scope.row.credentials" :preview-src-list="[scope.row.credentials]">
              </el-image>
            </div>
          </template>
        </el-table-column>

        <el-table-column label="创建时间">
          <template slot-scope="scope">
            <span>{{ scope.row.identify_at }}</span>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <div v-if="scope.row.status == 0">已通过</div>
            <div v-if="scope.row.status == -2">已拒绝</div>
            <el-button type="text" v-if="scope.row.status == -1" @click="shenhe(0,scope.row.id)">审核通过</el-button>
            <el-button type="text" v-if="scope.row.status == -1" @click="shenhe(-2,scope.row.id)">审核拒绝</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="fenye" style="padding: 20px; text-align: right;">
        <el-pagination background layout="prev, pager, next" @current-change="fanye" :page-size="all.page_size"
          :total="total"></el-pagination>
      </div>
    </div>
    <!-- 查看图片 -->
    <el-dialog
      title="查看图片"
      :visible.sync="showimg"
      width="1000px">
      <img :src="imglink" style="width: 100%;" alt="">
    </el-dialog>
  </div>
</template>

<script>
  import admin_top from './top.vue';
  import axios from 'axios'
  export default {
    components: {
      admin_top
    },
    name: 'adminqianming',
    data() {
      return {
        all: {
          shop_name:'',
          page_size: 200,
          page: 1,
        },
        tableData: "",
        total: "",
        loading: true,
        //搜索店铺名称
        imglink:'',
        showimg:false
      }
    },
    watch: {

    },
    computed: {

    },
    created() {
      this.getlist()
    },
    methods: {
      //放大图片
      openimg(url){
        console.log(url)
        this.imglink = url
        this.showimg = true
      },
      shenhe: function(status, shop_id) {

        if (status == -2) {
          this.$prompt('请输入拒绝理由', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
          }).then(({
            value
          }) => {
            axios.post('/api/plan-market/user/identify', {
                status: status,
                id: shop_id,
                reason: value
              })
              .then(response => {
                if (response.data.msg.code == 0) {
                  this.$message.success('已处理');
                  this.getlist()
                } else {
                  this.$message.error(response.data.msg.info);
                }
              })
          })
        }else{
          axios.post('/api/plan-market/user/identify', {
              status: status,
              id: shop_id
            })
            .then(response => {
              if (response.data.msg.code == 0) {
                this.$message.success('已处理');
                this.getlist()
              } else {
                this.$message.error(response.data.msg.info);
              }
            })
        }
        

      },
      //翻页
      fanye: function(page) {
        this.loading = true
        this.all.page = page
        this.getlist()
      },
      //获取全部
      getlist: function() {
        var that = this
        axios.get('/api/plan-market/user/identifies', {
            params: this.all
          })
          .then(response => {
            if (response.data.msg.code == 0) {
              this.tableData = response.data.data.data
              this.total = response.data.data.total
              this.loading = false
            } else {
              this.$message.error(response.data.msg.info);
            }
          })
      },
      //搜索
      search() {
            //获取列表
            this.getlist()
        },

    },

  }
</script>

<style scoped>
  .adminqianming {
    background: #EAEAEA;
    min-height: 100vh;
    padding: 0px;
  }
  .t_btn_box{
    display: flex;
    justify-content: flex-end;
  }
</style>
